<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>laji</title>
		<style>
			*{
				margin: 0;
				padding: 0;
				box-sizing: border-box;
			}
			body{
				font-family: "微软雅黑";
				text-align: center;
				display: flex;
				justify-content: center;
				height: 100vh;
				align-items: center;
			}
			table,p,span{
				display: inline-block;
			}
			tr{
				display: flex;
				flex-wrap: wrap;
				color: #000;
			}
			td{
				flex: 0 0 14.285714%;
				line-height: 50px;
				color: #000;
			}
			p{
				box-shadow: 0px 10px 200px #fff;
			}
			.qwe{
				border-bottom: 1px solid #000;
				box-shadow: 0px 0px 10px #8EBEFA;
				color: #000;
			}
		</style>
	</head>
	<body>
		<div class="iu">
			<table style="border: 1px solid #ea145dad;">
				<tr>
					<td class="qwe">日</td>
					<td class="qwe">一</td>
					<td class="qwe">二</td>
					<td class="qwe">三</td>
					<td class="qwe">四</td>
					<td class="qwe">五</td>
					<td class="qwe">六</td>
				</tr>
			<script>
				var year = Number(prompt('请输入年份'));
				var month = Number(prompt('请输入月份'));
				var date1 = Number(prompt('请输入日期'));

				var table = document.querySelector('table');
				if(year > 1900 && month <= 12 && month >= 1 && date1 >=1 && date1 <=31){
					document.write("<h1>" + "<p>" + year + "年"+ month + "月" + date1 + "日" + "</p>" +  "</h1>");
				}else{
					table.style.display = "none"
					alert("输入错误");
	//				document.write("<a href="http://xiao_jiu.gitee.io/calendar">重新开始</a>")
					window.location.href="http://xiao_jiu.gitee.io/calendar"
				}
				var sumYear = 0;
				for(var i = 1900;i<year;i++){
					if(i%4 == 0 && i % 100 != 0 || i%400 == 0){
						sumYear += 366;
					}else{
						sumYear += 365;
					}
				}	
				//    border: 1px solid #ea145dad;
				//    box-shadow: 3px 3px 100px #ea145dad;
				console.log(sumYear);
				for(var i = 0;i<month;i++){
					switch(i){
						case 1:
						case 3:
						case 5:
						case 7:
						case 8:
						case 10:
						case 12:
							sumYear+=31;
							break;
						case 4:
						case 6:
						case 9:
						case 11:
							sumYear+=30;
							break;
						case 2:
							if(i%4 == 0 && i % 100 != 0 || i%400 == 0){
								sumYear+=29;
							}else{
								sumYear+=28;
							}
					}
				}
				var week = (sumYear + 1) % 7 ;
				console.log(week);		
				var day = 0;
				switch(month){
					case 1:
					case 3:
					case 5:
					case 7:
					case 8:
					case 10:
					case 12:
						day=31;
						break;
					case 4:
					case 6:
					case 9:
					case 11:
						day=30;
						break;
					case 2:
						if(year%4 == 0 && year % 100 != 0 || year%400 == 0){
							day=29;
						}else{
							day=28;
						}
					}
				var shangDay = 0;
				var shangMonth = month == 1 ? 12 : month-1;
				switch(shangMonth){
					case 1:
					case 3:
					case 5:
					case 7:
					case 8:
					case 10:
					case 12:
						shangDay=31;
						break;
					case 4:
					case 6:
					case 9:
					case 11:
						shangDay=30;
						break;
					case 2:
						if(year%4 == 0 && year % 100 != 0 || year%400 == 0){
							shangDay=29;
						}else{
							shangDay=28;
						}
					}
					document.write("<tr class='tr'>")
					for(var i = shangDay - week+1;i<=shangDay;i++){
						document.write("<td style='color: #b2b2b27a;'>" + i + "</td>")
					}
	
					for(var i = 1;i<=day;i++){
						i == date1 ? document.write("<td style='background:#ec3299c4; color: #000;border-bottom: 1px solid #fff;box-shadow: 0px 0px 20px #ec3299c4;'>" + i + "</td>") : document.write("<td style=' color: #ddd;'>" + i + "</td>");
					}
	
					if(week >=0 ){
						weiZhi = 42 - day - week;
					}
					for(var i = 1;i<=weiZhi;i++){
						document.write("<td style='color: #999;'>" + i + "</td>");
					}
			</script>
			</table>	
<!--			<a href="http://xiao_jiu.gitee.io/calendar"></a>-->
		</div>	
	</body>
</html>
